import { Avatar, Tooltip } from 'antd';
import './index.less';


interface AvatarWithOverlayProps {
  src: string;
  size?: number;
  icon?: any;
  tooltip?: string;
  onClick?: ()=> void;
};

const AvatarWithOverlay : React.FC<AvatarWithOverlayProps> = ({
  src,size,icon,tooltip,onClick
}) => {
  return (
    <div className="avatar-container">
      <div className="avatar-wrapper">
        <Avatar
          className='avatar-image'
          src={src}
          size={size}
        />
        <div className="avatar-overlay">
          <Tooltip title={tooltip}>
            <div 
              className="overlay-icon" 
              onClick={onClick}
            >
              {icon}
            </div>
          </Tooltip>
        </div>
      </div>
    </div>
    
  );
};

export default AvatarWithOverlay;